<template>
	<view class="container">
	
		
		<!-- 地块图片 -->
		<view class="land-image-container">
			<image class="land-image" :src="landInfo.img ? `http://121.36.197.175:19000/test/${landInfo.img}` : '/static/default-land.png'" mode="aspectFill"></image>
		</view>
		
		<!-- 地块信息卡片 -->
		<view class="land-info-card">
			<!-- 价格信息 -->
			<view class="price-section">
				<view class="current-price">
					<text class="price-symbol">¥</text>
					<text class="price-value">{{landInfo.skPrice/100}}</text>
				</view>
				<view class="original-price" v-if="landInfo.discount > 0">
					<text>原价: ¥{{landInfo.price}}</text>
				</view>
			</view>
			
			<!-- 基本信息 -->
			<view class="info-section">
				<view class="info-item">
					<text class="info-label">位置：</text>
					<text class="info-value">{{landInfo.position || '暂无信息'}}</text>
				</view>
				<view class="info-item">
					<text class="info-label">面积：</text>
					<text class="info-value">{{landInfo.area}} 平方米</text>
				</view>
				<view class="info-item">
					<text class="info-label">农户：</text>
					<text class="info-value">{{landInfo.farmer || '暂无信息'}}</text>
				</view>
				<view class="info-item">
					<text class="info-label">库存：</text>
					<text class="info-value">{{landInfo.skNum}} 块</text>
				</view>
				<!-- <view class="info-item">
					<text class="info-label">状态：</text>
					<text class="info-value">{{getLandStatus(landInfo.state)}}</text>
				</view>
				<view class="info-item">
					<text class="info-label">创建时间：</text>
					<text class="info-value">{{formatDate(landInfo.createtime)}}</text>
				</view> -->
			</view>
			
			<!-- 地块详情 -->
			<view class="detail-section">
				<view class="section-title">地块详情</view>
				<view class="detail-content">
					{{landInfo.info || '暂无详细信息'}}
				</view>
			</view>
		</view>
		
		<!-- 底部操作区 -->
		<view class="bottom-action">
			<view class="action-btn" @click="contactFarmer">联系农户</view>
			<view class="action-btn primary" @click="buyNow" :class="{disabled: landInfo.skNum <= 0 && getStatus !== 1}">
				{{landInfo.skNum <= 0 ? '已售罄' : (getStatus == 1 ? '立即购买' : '已下架')}}
			</view>
		</view>
	</view>
</template>

<script>
	import request from '@/util/request.js'
	
	export default {
		data() {
			return {
				landId: null,
				getStatus: null,
				landInfo: {
				}
			}
		},
		onLoad(options) {
			if (options.landId) {
				this.landId = options.landId
				this.getStatus = options.getStatus
				console.log(this.getStatus,"当前购买状态")
				this.getLandDetail()
			} else {
				uni.showToast({
					title: '参数错误',
					icon: 'none'
				})
				setTimeout(() => {
					uni.navigateBack()
				}, 1500)
			}
		},
		methods: {
			// 获取地块详情
			getLandDetail() {
				uni.showLoading({
					title: '加载中'
				})
				
				request({
					url: '/land-service/secondKill/selectById',
					method: 'GET',
					data: {
						landId: this.landId
					}
				}).then(res => {
					if (res.success && res.data.tbSecondkill) {
						this.landInfo = res.data.tbSecondkill
					} else {
						uni.showToast({
							title: '获取地块详情失败',
							icon: 'none'
						})
					}
				}).catch(err => {
					console.error('获取地块详情失败:', err)
					uni.showToast({
						title: '获取地块详情失败',
						icon: 'none'
					})
				}).finally(() => {
					uni.hideLoading()
				})
			},
			
			// 获取地块状态文本
			getLandStatus(state) {
				const statusMap = {
					0: '未上架',
					1: '已上架',
					2: '已售罄',
					3: '已下架'
				}
				return statusMap[state] || '未知状态'
			},
			
			// 格式化日期
			formatDate(timestamp) {
				if (!timestamp) return '暂无信息'
				
				const date = new Date(timestamp)
				const year = date.getFullYear()
				const month = (date.getMonth() + 1).toString().padStart(2, '0')
				const day = date.getDate().toString().padStart(2, '0')
				
				return `${year}-${month}-${day}`
			},
			
			// 返回上一页
			goBack() {
				uni.navigateBack()
			},
			
			// 联系农户
			contactFarmer() {
				uni.showToast({
					title: '联系功能开发中',
					icon: 'none'
				})
			},
			
			// 立即购买
			buyNow() {
				if (this.landInfo.stock <= 0 || this.landInfo.state !== 1) {
					return
				}
				
				uni.showToast({
					title: '购买功能开发中',
					icon: 'none'
				})
				// 实际开发中这里应该跳转到订单确认页面
			}
		}
	}
</script>

<style>
.container {
	padding-bottom: 120rpx;
	background-color: #f5f5f5;
}

.header {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #4CAF50;
	color: #ffffff;
	padding: 20rpx 30rpx;
	position: relative;
}

.title {
	font-size: 36rpx;
	font-weight: bold;
}

.back-btn {
	position: absolute;
	left: 30rpx;
}

.land-image-container {
	width: 100%;
	height: 400rpx;
	overflow: hidden;
}

.land-image {
	width: 100%;
	height: 100%;
}

.land-info-card {
	margin: 20rpx;
	background-color: #ffffff;
	border-radius: 12rpx;
	padding: 30rpx;
	box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
}

.price-section {
	margin-bottom: 30rpx;
	display: flex;
	align-items: baseline;
}

.current-price {
	display: flex;
	align-items: baseline;
}

.price-symbol {
	color: #FF5722;
	font-size: 28rpx;
}

.price-value {
	color: #FF5722;
	font-size: 40rpx;
	font-weight: bold;
}

.original-price {
	margin-left: 20rpx;
	color: #999;
	font-size: 24rpx;
	text-decoration: line-through;
}

.info-section {
	border-bottom: 1px solid #f0f0f0;
	padding-bottom: 30rpx;
	margin-bottom: 30rpx;
}

.info-item {
	display: flex;
	margin-bottom: 16rpx;
}

.info-label {
	width: 160rpx;
	color: #666;
	font-size: 28rpx;
}

.info-value {
	flex: 1;
	color: #333;
	font-size: 28rpx;
}

.detail-section {
	padding-top: 10rpx;
}

.section-title {
	font-size: 32rpx;
	font-weight: bold;
	margin-bottom: 20rpx;
}

.detail-content {
	font-size: 28rpx;
	color: #666;
	line-height: 1.6;
}

.bottom-action {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	display: flex;
	background-color: #ffffff;
	padding: 20rpx;
	box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.05);
}

.action-btn {
	flex: 1;
	height: 80rpx;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 40rpx;
	margin: 0 10rpx;
	font-size: 28rpx;
	background-color: #f5f5f5;
	color: #666;
}

.action-btn.primary {
	background-color: #FF5722;
	color: #ffffff;
}

.action-btn.disabled {
	background-color: #cccccc;
	color: #ffffff;
}
</style>
